import { createRouter, createWebHistory } from "vue-router";
import NProgress from "nprogress";
import "nprogress/nprogress.css";
import home from "@/views/home/index.vue";
import { useUserStore } from "@/stores/user";

NProgress.configure({
  showSpinner: false,
  easing: "ease",
  speed: 500,
});

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: "/",
      redirect: "/dashboard",
    },
    {
      path: "/dashboard",
      name: "dashboard",
      component: () => import("@/views/dashboard/index.vue"),
      meta: { title: "首页", requiresAuth: true },
      redirect: "/vehiclePage",
      children: [
        {
          path: "/tools",
          name: "tools",
          component: () => import("@/views/tools/index.vue"),
          meta: { title: "工具", requiresAuth: true },
        },
        {
          path: "/controllers",
          name: "controllers",
          component: () => import("@/views/controllers/index.vue"),
          meta: { title: "控制器", requiresAuth: true },
        },
        {
          path: "/vehiclePage",
          name: "vehiclePage",
          component: () => import("@/views/vehiclePage/index.vue"),
          meta: { title: "车辆管理", requiresAuth: true },
        },
        {
          path: "/tech",
          name: "tech",
          component: () => import("@/views/tech/index.vue"),
          meta: { title: "技术问问", requiresAuth: true },
        },
        {
          path: "/userInfo",
          name: "userInfo",
          component: () => import("@/views/userInfo/index.vue"),
          meta: {
            title: "用户信息",
            requiresAuth: true,
          },
        },
      ],
    },
    // {
    //   path: "/home",
    //   name: "home",
    //   meta: {
    //     title: "首页",
    //     keepAlive: true
    //   },
    //   component: home,
    // },
    {
      path: "/login",
      name: "login",
      component: () =>
        import(/* webpackChunkName: "login" */ "@/views/login/index.vue"),
      meta: {
        title: "登录",
        hideTabBar: true,
      },
    },
    {
      path: "/tire-calculator",
      name: "tireCalculator",
      component: () => import(/* webpackChunkName: "tire-calculator" */ "@/views/tire-calculator/index.vue"),
      meta: {
        title: "轮胎周长计算器"
      }
    },
    {
      path: "/abs-calculator",
      name: "absCalculator",
      component: () => import(/* webpackChunkName: "abs-calculator" */ "@/views/abs-calculator/index.vue"),
      meta: {
        title: "ABS齿圈计算器"
      }
    },
    {
      path: "/iframes",
      name: "iframes",
      component: () => import(/* webpackChunkName: "sign-in" */ "@/views/iframes/index.vue"),
      meta: {
        title: "某核车型说明书"
      }
    },
    {
      path: "/controller-categories",
      name: "controllerCategories",
      component: () => import(/* webpackChunkName: "controller" */ "@/views/controller-categories/index.vue"),
      meta: {
        title: "控制器分类"
      }
    },
    {
      path: "/faq-contact",
      name: "faqContact",
      component: () => import(/* webpackChunkName: "faq" */ "@/views/faq-contact/index.vue"),
      meta: {
        title: "常见问题和联系我们"
      }
    },
    // {
    //   path: "/clockIn",
    //   name: "clockIn",
    //   component: () => import(/* webpackChunkName: "faq" */ "@/views/clockIn/index.vue"),
    //   meta: {
    //     title: "打卡",
    //     showHeader: true
    //   }
    // },

    // {
    //   path: "/vehicles/:id",
    //   name: "vehicleDetail",
    //   component: () =>
    //     import(/* webpackChunkName: "vehicles" */ "@/views/vehicle/Detail.vue"),
    //   meta: { title: "车辆详情", requiresAuth: true, hideTabBar: true },
    // },
    {
      path: "/mileage-detail",
      name: "mileageDetail",
      component: () =>
        import(
          /* webpackChunkName: "vehicle" */ "@/views/mileage-detail/index.vue"
        ),
      meta: {
        title: "骑行里程",
        requiresAuth: true,
      },
    },
    {
      path: "/vehicle-detail",
      name: "vehicleDetail",
      component: () => import(/* webpackChunkName: "vehicle-detail" */ "@/views/vehicle-detail/index.vue"),
      meta: {
        title: "车辆详情",
        requiresAuth: true,
        hideTabBar: true,
      },
    },
    {
      path: "/battery-detail",
      name: "batteryDetail",
      component: () =>
        import(
          /* webpackChunkName: "vehicle" */ "@/views/battery-detail/index.vue"
        ),
      meta: {
        title: "电池详情",
        requiresAuth: true,
      },
    },
    {
      path: "/vehicle-settings",
      name: "vehicleSettings",
      component: () => import(/* webpackChunkName: "vehicle-settings" */ "@/views/vehicle-settings/index.vue"),
      meta: {
        title: "车辆设置",
        requiresAuth: true,
      },
    },
  ],
  scrollBehavior(to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition;
    } else {
      return { top: 0 };
    }
  },
});

// 访问权限控制
router.beforeEach((to, from, next) => {
  window.test = (value) => {
    document.documentElement.style.setProperty(
      "--zoomin",
      value.fontSize + "px"
    );
  };
  NProgress.start();

  const userStore = useUserStore();

  // 检查页面是否需要登录权限
  if (to.matched.some((record) => record.meta.requiresAuth)) {
    if (!userStore.isLoggedIn) {
      next({
        path: "/login",
        query: { redirect: to.fullPath }, 
      });
    } else {
      next();
    }
  } else {
    next();
  }
});

router.afterEach((to) => {
  // 修改标题
  document.title = `慢牛电控-${to.meta.title || ""}`;
  NProgress.done();
});

export default router;
